<template>
  <div class="Rights_management_Platform_infor">
    <div class="pubBig Privilege">
      <div class="h0">
        <p class="lt">{{msg.label}}</p>
      </div>
      <div class="dUpMain">

      </div>
      <div class="dDownMain">
        <div
          class="twoBox"
          :style="this.$route.query.Token ? 'top:50px;left:10px':'top: 100px;padding:10px'"
        >
          <el-tabs
            type="border-card"
            style="height:830px;over-flow:auto"
            v-model="activeName"
          >
            <el-tab-pane
              label="系统信息"
              name="first"
            >
              <el-row>
                <el-col
                  :span="12"
                  style="margin: 15px 0"
                >
                  <span>系统名称：</span>
                  <span
                    style="font-size:16px;font-weight: 700;">{{msg.label}}</span>
                </el-col>
                <el-col
                  :span="12"
                  style="margin: 15px 0"
                >
                  <span>系统英文名：</span>
                  <span
                    style="font-size:16px;font-weight: 700;">{{msg.name}}</span>
                </el-col>
                <el-col
                  :span="12"
                  style="margin: 15px 0"
                >
                  <span>后端接口：</span>
                  <span style="font-size:16px;font-weight: 700;">无</span>
                </el-col>
                <el-col
                  :span="12"
                  style="margin: 15px 0"
                >
                  <span>系统访问路径：</span>
                  <span
                    style="font-size:16px;font-weight: 700;">http://192.168.0.210:8002/SystemManagement/{{msg.name}}</span>
                </el-col>
                <el-col
                  :span="12"
                  style="margin: 15px 0"
                >
                  <span>权限码：</span>
                  <span
                    style="font-size:16px;font-weight: 700;">{{msg.id}}</span>
                </el-col>
              </el-row>
            </el-tab-pane>
            <el-tab-pane
              label="API文档"
              name="second"
            >

              <el-card
                class="box-card"
                style="margin:15px 0"
              >
                <div
                  slot="header"
                  class="clearfix"
                >
                  <span style="font-weight: 700;">页面信息</span>
                  <el-button
                    style="float: right; padding: 3px 0"
                    type="text"
                  >编辑</el-button>
                </div>
                <span
                  style="display:inline-block;width:15%;margin:10px">页面名称：<span
                    style="font-size:16px;font-weight: 700;"
                  >{{msg.label}}</span></span>
                <span
                  style="display:inline-block;width:15%;margin:10px">页面英文名：<span
                    style="font-size:16px;font-weight: 700;"
                  >{{msg.name}}</span></span>
                <span
                  style="display:inline-block;width:15%;margin:10px">页面权限码：<span
                    style="font-size:16px;font-weight: 700;"
                  >{{msg.id}}</span></span>
              </el-card>

              <el-card
                class="box-card"
                style="margin:15px 0"
              >
                <div
                  slot="header"
                  class="clearfix"
                >
                  <span style="font-weight: 700;">操作权限</span>
                  <el-select
                    v-model="value"
                    placeholder="请选择"
                    style="float: right;"
                  >
                    <el-option
                      v-for="item in options"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </div>
                <el-table
                  :data="tableData_CZQX"
                  style="width: 100%"
                >
                  <el-table-column
                    prop="date"
                    label="操作权限名"
                    align="center"
                  >
                  </el-table-column>
                  <el-table-column
                    prop="name"
                    align="center"
                    label="权限码"
                  >
                  </el-table-column>
                  <el-table-column
                    prop="address"
                    align="center"
                    label="操作"
                  >
                  </el-table-column>
                </el-table>
              </el-card>

              <el-card
                class="box-card"
                style="margin:15px 0"
              >
                <div
                  slot="header"
                  class="clearfix"
                >
                  <span style="font-weight: 700;">操作权限</span>
                  <el-button
                    size="mini"
                    style="float: right;"
                  >新建数据权限</el-button>
                </div>
                <el-table
                  :data="tableData_SJQX"
                  style="width: 100%"
                >
                  <el-table-column
                    prop="date"
                    label="操作权限名"
                    align="center"
                  >
                  </el-table-column>
                  <el-table-column
                    prop="name"
                    align="center"
                    label="权限码"
                  >
                  </el-table-column>
                  <el-table-column
                    prop="address"
                    align="center"
                    label="操作"
                  >
                  </el-table-column>
                </el-table>
              </el-card>

            </el-tab-pane>
            <el-tab-pane
              label="新增菜单"
              name="third"
            >

              <el-card class="box-card">
                <div
                  slot="header"
                  class="clearfix"
                >
                  <span style="font-weight: 700;">菜单信息</span>
                  <el-button
                    size="mini"
                    style="float:right"
                  >保存</el-button>
                </div>
                <el-form
                  label-position="right"
                  label-width="130px"
                  :model="formLabelAlign"
                >
                  <el-form-item
                    label="菜单名称："
                    style="display:inline-block;width:25%"
                  >
                    <el-input v-model="formLabelAlign.name"></el-input>
                  </el-form-item>
                  <el-form-item
                    label="菜单英文名："
                    style="display:inline-block;width:25%"
                  >
                    <el-input v-model="formLabelAlign.Ename"></el-input>
                  </el-form-item>
                  <el-form-item
                    label="菜单权限码："
                    style="display:inline-block;width:25%"
                  >
                    <el-input
                      disabled
                      v-model="formLabelAlign.TCode"
                    ></el-input>
                  </el-form-item>
                </el-form>
              </el-card>

            </el-tab-pane>
          </el-tabs>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "",
  data () {
    return {
      msg: {},
      activeName: 'first',
      value: '',
      options: [{
        value: '选项1',
        label: '黄金糕'
      }, {
        value: '选项2',
        label: '双皮奶'
      }, {
        value: '选项3',
        label: '蚵仔煎'
      }, {
        value: '选项4',
        label: '龙须面'
      }, {
        value: '选项5',
        label: '北京烤鸭'
      }],
      tableData_CZQX: [],
      tableData_SJQX: [],
      formLabelAlign: {}
    };
  },
  methods: {
  },
  watch: {
    $route (to) {
      console.log(to.query);
      this.msg = to.query
      this.formLabelAlign.TCode = this.msg.id
      this.activeName = 'first'
    }
  },
  mounted () {
    // document.getElementById("2").focus();
  },
  created () {
    if (this.$route.query.Token) {
      localStorage.setItem('Token', this.$route.query.Token)
    }
  }
};
</script>
<style lang="scss">
// .Rights_management_Platform_infor {
// }
.top-input {
  display: inline-block;
  width: 350px;
}

.box-top {
  margin-top: 15px;
  margin-left: 5px;
}
</style>
